<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>order_1</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<script src="../js/public.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<style>
		   body{padding-bottom: 4.8rem;}
		   dd{margin: 0;}
		   .mui-bar-nav {
			    background-color: #71BB98;
			}
			.mui-bar-nav a{color:#fff;}
			.mui-title{color:#fff;font-size:1.2rem;}
		   .mui-content-padded{margin-top: 1rem;}
			.fl{
				float: left;
			}
			.fr{
				float: right;
			}
			.chart_bot{
				background: #fff;
				padding:1rem;
				padding-top:0.5rem;
				width:100%;
			}
			
			.chart_bot h2{
				font-size: 1.1rem;
				font-weight: 500;
				color:#F47D00;
				border-left:5px solid #5b72f4;
				padding-left: 0.5rem;
				line-height: 1.5rem;
			}
			
			.mui-media-body{line-height: 42px;}
			.mui-table-view{background: transparent;}
			.mui-table-view-cell{padding:0;margin:-10px 0;}
			.mui-table-view:before{height: 0;}
			.mui-table-view:after{height: 0;}
			.ph img{display: block;margin:0 auto;width: 60%;}
			.orderto{text-align: center;margin-top: 2rem;}
			.orderto a{width: 15%;}
			.abnormal{height: 2rem;}
			.abnormal label{width: 28%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; min-width:50px;text-align: right;margin-top:0.2rem;font-size: 0.8rem;}
			.abnormal input{width: 72%;padding-right: 0; border:0;background: transparent;font-size: 0.8rem;height: 1.5rem;margin-bottom: 0;}
			.mui-bar-tab .mui-tab-item {
			    background: #71bb9a;
			    color: #fff;
			}
			.mui-bar-tab .mui-tab-item.mui-active {
			    color: red;
			}
			.active{overflow-y: scroll;max-height: 18rem;}
			.active p{height: 1rem;font-size: 0.8rem;margin:0.7rem 0;}
			.active p a{width: 70%;overflow: hidden;white-space: normal;text-overflow: ellipsis; color:#777777;}
			.active p span{width: 25%;overflow: hidden;white-space: normal;text-overflow: ellipsis; }
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">个人信息</h1>
		    <a class="mui-icon mui-icon-gear-filled mui-pull-right" id="set"></a>
		</header>
		<div class="mui-content">
			<div class="mui-content-padded">
				<div class="fl chart_bot" style="background: transparent;border:2px dashed rgb(0,153,255);border-radius: 8px;">
					<div class="mui-row">
						<div class="mui-col-xs-4 ph">
							<img src="../img/u38.png" id="userPic"/>
						</div>
						<div class="mui-col-xs-8 ph_info">
							<div class="abnormal">
								<label for="" class="fl">用户名：</label>
								<input type="text" class="fl" id="username" readonly="readonly" value="XXXX" />
								<div class="mui-clearfix"></div>
							</div>
							<!--<div class="abnormal">
								<label for="" class="fl">评定等级：</label>
								<input type="text" class="fl" readonly="readonly" value="3级" />
								<div class="mui-clearfix"></div>
							</div>-->
							<!--<div class="abnormal">
								<label for="" class="fl">最后上线：</label>
								<input type="text" class="fl" readonly="readonly" value="" />
								<div class="mui-clearfix"></div>
							</div>-->
						</div>
					</div>
					
					
	
					
				</div>
				<div class="mui-clearfix"></div>
			</div>
			<div class="mui-content-padded">
				<div class="chart_bot">
					<h2>基本信息</h2>
					<hr style="margin-bottom: 1rem;" />
					<div class="mui-row">
						<div class="mui-col-xs-4">
							<div class="abnormal">
								<label for="" class="fl">姓名</label>
								<input type="text" class="fl" id="realname" readonly="readonly" value="XXX" />
								<div class="mui-clearfix"></div>
							</div>
							
							<div class="abnormal">
								<label for="" class="fl">手机号</label>
								<input type="text" class="fl" id="phone" readonly="readonly" value="XXXXXXXXX" />
								<div class="mui-clearfix"></div>
							</div>
						</div>
						<div class="mui-col-xs-4">
							<!--<div class="abnormal">
								<label for="" class="fl">性别</label>
								<input type="text" class="fl" readonly="readonly" value="男" />
								<div class="mui-clearfix"></div>
							</div>-->
							<div class="abnormal">
								<label for="" class="fl">单位</label>
								<input type="text" class="fl" id="unit" readonly="readonly" value="XXXX" />
								<div class="mui-clearfix"></div>
							</div>
							<!--<div class="abnormal">
								<label for="" class="fl">邮箱号</label>
								<input type="text" class="fl" readonly="readonly" value="980006096@qq.com" />
								<div class="mui-clearfix"></div>
							</div>-->
						</div>
						<div class="mui-col-xs-4">
							
							<div class="abnormal">
								<label for="" class="fl">部门</label>
								<input type="text" class="fl" id="department" readonly="readonly" value="XXXX" />
								<div class="mui-clearfix"></div>
							</div>
							<!--<div class="abnormal">
								<label for="" class="fl">出生年月</label>
								<input type="text" class="fl" readonly="readonly" value="1986-02-15" />
								<div class="mui-clearfix"></div>
							</div>-->
							<!--<div class="abnormal">
								<label for="" class="fl">职位</label>
								<input type="text" class="fl" readonly="readonly" value="XXXX" />
								<div class="mui-clearfix"></div>
							</div>-->
						</div>
						<!---->
					</div>
					
				</div>
				
			</div>
			<div class="mui-content-padded">
				<div class="fl chart_bot">
					<h2>近期活动</h2>
					<hr style="margin-bottom: 1rem;" />
					<div class="active" id="active">
						 
					</div>
					
				</div>
				<div class="mui-clearfix"></div>
			</div>
		</div>
		<nav class="mui-bar mui-bar-tab">
		    <a class="mui-tab-item" style="border-right: 2px solid #fff;" href="examples/echarts.html" target="list" id="home">
		        <span class="mui-icon mui-icon-home"></span>
		    </a>
		    <a class="mui-tab-item mui-active" href="" id="my">
		        <span class="mui-icon mui-icon-person"></span>
		    </a>
		</nav>
		
	</body>
	<script type="text/javascript">
	var user = JSON.parse(localStorage.getItem('$users')).account;
	var username = document.getElementById('username');
	var realname = document.getElementById('realname');
	var unit = document.getElementById('unit');
	var department = document.getElementById('department');
	var phone = document.getElementById('phone');
	var userPic = document.getElementById('userPic');
	function send(){
		     	mui.ajax({
		            type: "post",
				    url: __PATH__+"index/per_information",
				    async: true,
				    data:{
				    	user:user
				    },
				    dataType: "json",
				    json: "jsoncallback",
				    timeout: 1000,
				    success: function(data) {
				    	console.log(data);
				    	userPic.src=__PATH__+data[0].img;
				    	username.value=data[0].username;
				    	realname.value=data[0].realname;
				    	unit.value=data[0].unit;
				    	department.value=data[0].department;
				    	phone.value=data[0].phone;
				    	mui.each(data[1],function(item,i){
				   	     var html = '<p><a href="javascript:void(0);" class="fl p">'+i.resourceName+i.abnormal_name+'</a><span class="fr">'+i.updatetime+'</span></p>'
	                        mui('#active')[0].insertAdjacentHTML('afterbegin', html);
					    });
				    },
				    error:function(xhr,type,errorThrown){
						mui.alert(xhr,'提示') 				
					}
				});
		     };
    setTimeout("send()",200);
		(function($, doc) {
			$.init();
			
			

//			var settings = app.getSettings();
			document.getElementById("set").addEventListener('tap', function() {
				mui.openWindow({
							url:"setting.html",
							id:"setting",
							style:{},
						   extras:{
//						   	content:this.firstChild.innerHTML,
//						   	time:this.lastChild.innerHTML
						   },
							show:{
								autoShow:true,
								aniShow:"slide-in-right",
								duration:100
							},
							waiting:{
								autoShow:true,
								title:"正在加载·····",
								options:{
								}
							}
					})
			});
			doc.getElementById('home').addEventListener('tap',function(){
					 mui.openWindow({
							url:"../main.html",
							id:"main",
							style:{},
							show:{
								autoShow:true,
								aniShow:"slide-in-right",
								duration:100
							},
							waiting:{
								autoShow:true,
								title:"正在加载·····",
								options:{
								}
							}
					})
			});
			$.plusReady(function() {
				
				//--
				$.oldBack = mui.back;
				var backButtonPress = 0;
				$.back = function(event) {
					backButtonPress++;
					if (backButtonPress > 1) {
						plus.runtime.quit();
					} else {
						plus.nativeUI.toast('再按一次退出应用');
					}
					setTimeout(function() {
						backButtonPress = 0;
					}, 1000);
					return false;
				};
			});
			
		}(mui, document));
	</script>
</html>